<template>
  <div class="service-page">
    <el-descriptions
      class="margin-top"
      :title="'#' + serviceInfo.serviceId + $t(serviceInfo.serviceName)"
      :column="1"
    >
      <el-descriptions-item :label="$t('价格')"
        >¥{{ serviceInfo.price }}</el-descriptions-item
      >
      <el-descriptions-item :label="$t('预计时间')">{{
        serviceInfo.time
      }}</el-descriptions-item>
      <el-descriptions-item :label="$t('提交方式')">
        {{ $t("发送IMEI或序列号") }}
        <!--                <button v-if="isWxOrMobile()" @click="cv">扫一扫</button>-->
      </el-descriptions-item>
      <el-descriptions-item :label="$t('服务说明')">
        <span v-html="serviceInfo?.describtion" />
      </el-descriptions-item>
    </el-descriptions>
    <!--        <Cv :show="showCv" @close-cv="closeCv" @scan-result="scanResult" v-if="showCv"/>-->
  </div>
</template>

<script>
import apiService from "@/api/apiService";
import { isMobile, isWx } from "@/utils";
// import Cv from "@/views/Cv.vue";

export default {
  // eslint-disable-next-line vue/multi-word-component-names
  name: "ServiceInfo",
  // components: {Cv},
  data() {
    return {
      imeis: "",
      serviceId: "",
      serviceInfo: "",
      //是否显示扫一扫
      showCv: false,
    };
  },
  mounted() {
    this.serviceId = this.$route.query.goParam;
    if (this.serviceId !== undefined && this.serviceId !== "") {
      const param = {
        serviceId: this.serviceId,
      };
      apiService.post("/select-service", param).then((res) => {
        console.log(`output->res`, res);
        if (res.code === 0) {
          this.serviceInfo = res.data;
        }
      });
    } else {
      if (this.$route.query.flag !== "4") {
        this.$notify({
          title: "" + Date.now(),
          message: JSON.stringify(this.$route.query, null, 2),
          duration: 0,
        });
      } else {
        this.$notify({
          title: "" + Date.now(),
          message: JSON.stringify(this.$route.query, null, 2),
          duration: 0,
          position: "bottom-right",
        });
      }
    }
  },
  methods: {
    isWxOrMobile() {
      return isWx() || isMobile();
    },
    scanResult(val) {
      this.imeis = val;
    },
    closeCv() {
      this.showCv = false;
    },
    cv() {
      this.showCv = true;
    },
  },
};
</script>

<style lang="scss" scoped>
.service-page {
  height: 100%;
  box-shadow: 0 0 0 0.2rem #00000005;
  border-radius: 10px;
  border: solid white 1px;
  background: rgb(255, 255, 255);
  margin: auto;
  //width: 95%;
  padding: 20px;
}
</style>
